<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>房费统计</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <script type="text/javascript" src="../../script/aes.js"></script>
	<script type="text/javascript" charset="UTF-8" src="../../script/naes.js"></script>
	<script type="text/javascript" src="../../script/modeecb.js"></script>
    <script type="text/javascript" src="../../script/tmd5.js"></script>
    <script type="text/javascript" src="../../script/constants.js"></script>
    <script type="text/javascript" src="../../resource/jquery214.js"></script>
    <script src="../../script/api.js"></script>
    <style>
    	body{
    		margin: 0;
    	}
    	.title{
    	    height: 45px;
    	    background: #0483d3;
    	    line-height: 45px;
    	    font-size: 20px;
    	    margin-bottom: 20px;
    	    position:fixd;
    	    position:fixed;
            margin-top:0; 
            width: 100%;
    	}
    	.RM_NUM{
    	    color: #fff;
    	    font-size: 24px;
    	    padding-left:5px;
    	}
    	.RM_M{
    	    color: #fff;
    	    font-size: 14px;
    	    padding-left:5px;
    	}
    	
    	.select {
    	    padding-top:5px;
    	    padding-bottom:5px;
			border: solid 1px #757575;
			appearance:none;
    		background: #e1e5ee;
    		color: #707070;
    		outline: medium none;
    		width:100%;
    		height:100%;
    		font-size: 16px;
		}
		
    </style>
</head>
<body>
<header id="statusBar">
<div class="title">
    <div style="float: left;width: 30px;height: 30px;padding: 7.5px;" onclick="api.closeWin();">
    <img src="../../image/hotelManage/back.png"  style="width: 100%;"/>
    </div>
    <div style="float: left;color: #ffffff;">
     预定信息
    </div>
  </div>
  </header>
  <div style="height: 45px;"></div>
	<div style="background: #e1e5ee;height: 45px;line-height: 45px;">
	   <div style="color: #707070;float: left;width: 48%;" id="sum">
	   房费总计：1000元
	   </div>
	   <!-- <div style="float: left;margin-left: 10%;width: 37%;" onclick="method();">
	   <div style="color: #707070;float: left;" id="category">
	   每月数据
	   </div>
	   <div style="width:20%;float: left;display: table-cell; vertical-align: middle;">
	   <img src="../../image/hotelManage/dow.png" style="width: 100%;vertical-align: middle;"/>
	   </div>
	   </div> -->
	   <div style="float: left;margin-left: 1%;width: 24%;">
		   <select class="select" onchange="kind();" id="kind">
		      <option selected value="0">按月统计</option>
		      <option value="1">一周统计</option>
		      <option value="2">季度统计</option>
		   </select>
	   </div>
	   <div style="float: left;margin-left: 2%;width: 24%;">
		   <select class="select" onchange="showType();" id="showType">
		      <option selected value="0">图形</option>
		      <option value="1">文字</option>
		   </select>
	   </div>
	</div>
	<div style="text-align: center;margin-top: 20px;" id="data" >
	  
	</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
    var lineId = 0;
    var hotelId = $api.getStorage("hotelId");
	apiready = function(){
	    if(api.systemType == "ios"){
		   document.getElementById("statusBar").style.background = "#298cb4";
		}
	    $api.fixStatusBar( $api.dom('header') );
	    
	    monthCount();
	};
	
	
	function kind(){
	   var kind = $("#kind").val();
	   var type = $("#showType").val();
	   var UILineChart = api.require('UILineChart');
	       UILineChart.close({
			 id: lineId
	   });
	   if(type == "0"){
		  if(kind == "0"){
			 monthCount();
		  }else if(kind == "1"){
			 weekCount();    
		  }else if(kind == "2"){
			 quarterCount();	    
		  }
	    }else if(type == "1"){
		  characterCount(kind);
		}
	}
	
	function lineChart(xcount,sum,max,index){
	        var UILineChart = api.require('UILineChart');
	        UILineChart.open({
			    rect: {
			        x: api.winWidth*0.02,
			        y: 100,
			        w: api.winWidth*0.95,
			        h: 300
			    },
			    xAxis: {
			        indexs: eval("("+index+")"),
			        screenXcount: xcount
			    },
			    yAxis: {
			        max: max,
			        min: 0,
			        step: 200,
			        base: 0
			    },
			    datas: [
			        //[0, 100, 600, 0, 500,100,0,0,0,0,600,0]
			        eval("("+sum+")")
			    ],
			    styles: {
			        xAxis: {
			            bg: '#b2dfee',
			            markColor: '#888',
			            markSize: 12
			        },
			        yAxis: {
			            bg: '#b2dfee',
			            markColor: '#888',
			            markSize: 12
			        },
			        coordinate: {
			            bg: '#fcfcfc',
			            color: '#cacaca',
			            baseColor: 'bbb',
			        },
			        colors: ['#43CD80']
			    },
			    fixedOn: api.frameName,
			    fixed: false
			}, function(ret, err) {
			    if (ret) {
			        lineId = ret.id;
			    } else {
			        alert(JSON.stringify(err));
			    }
			});
	}
	
    function showType(){
        var type = $("#showType").val();
        var kind = $("#kind").val();
        var UILineChart = api.require('UILineChart');
	        UILineChart.close({
			    id: lineId
		});
		if(type == "0"){
		  if(kind == "0"){
			 monthCount();
		  }else if(kind == "1"){
			 weekCount();    
		  }else if(kind == "2"){
			 quarterCount();	    
		  }
		}else if(type == "1"){
		  characterCount(kind);
		}
    }
    
    function quarterCount(){
       var date = new Date();
		    var callback = function(ret, err){
		        if(ret.success == true || ret.success == "true"){
		           var data = eval("("+ret.data+")");
		           var sum = "[";
		           var index = "['第一季度','第二季度','第三季度','第四季度']";
		           var total = 0;
		           var j = 0;
		           var money = 0;
		           for(var i=0;i<data.length;i++){
		              if(j == 2){
		                 j = 0;
		                 sum += money+",";
		                 money = 0;
		              }else{
		                 j++;
		              }
		              money = money + parseInt(data[i].total);
			          total = total + parseFloat(data[i].total);
			       }
			       $("#sum").html("房费总计："+total+"元");
		           sum = sum.substring(0,sum.length-1)+"]";
		           index = index.substring(0,index.length-1)+"]";
		           var max = Math.max.apply(null,eval("("+sum+")"));
		           lineChart(4,sum,max,index);
		        }
		    }
		    var content = {"hotelId":hotelId,"year":date.getFullYear()};
		    apiAjax(JSON.stringify(content),url.monthSum,callback);
    
    }
    
    function weekCount(){
        var callback = function(ret, err){
	        if(ret.success == true || ret.success == "true"){
	           var data = eval("("+ret.data+")");
	           var sum = "[";
	           var index = "[";
	           var total = 0;
	           for(var i=0;i<data.length;i++){
	              sum += data[i].total+",";
	              index += "'"+data[i].rzday.substring(5,data[i].rzday.length)+"',";
	              total = total + parseFloat(data[i].total);
	           }
	           $("#sum").html("房费总计："+total+"元");
	           sum = sum.substring(0,sum.length-1)+"]";
	           index = index.substring(0,index.length-1)+"]";
	           var max = Math.max.apply(null,eval("("+sum+")"));
	           lineChart(data.length,sum,max,index);
	        }
	     }
	     var content = {"hotelId":hotelId};
	     apiAjax(JSON.stringify(content),url.weekSum,callback);
    }
    
    function monthCount(){
	    var date = new Date();
	    var callback = function(ret, err){
	        if(ret.success == true || ret.success == "true"){
	           if(ret.data == "[]"){
	               api.alert({msg: "暂无入住信息，无法统计"});
	               setTimeout(function(){
	                  api.closeWin();
	               },500); 
	           }else{
		           var data = eval("("+ret.data+")");
		           var sum = "[";
		           var index = "[";
		           var total = 0;
		           for(var i=0;i<data.length;i++){
		              sum += data[i].total+",";
	                  index += "'"+data[i].wmonth+"',";
			          total = total + parseFloat(data[i].total);
			       }
		           $("#sum").html("房费总计："+total+"元");
		           sum = sum.substring(0,sum.length-1)+"]";
		           index = index.substring(0,index.length-1)+"]";
		           var max = Math.max.apply(null,eval("("+sum+")"));
		           lineChart(data.length,sum,max,index);
	           }
	        }else{
	           api.alert({msg: JSON.stringify(err)});
	        }
	    }
	    var content = {"hotelId":hotelId,"year":date.getFullYear()};
	    apiAjax(JSON.stringify(content),url.monthSum,callback);
	}
	
	//文字统计
	function  characterCount(kind){
	    var link = "";
	    if(kind == "1"){
	      link = url.weekSum;
	    }else{
	      link = url.monthSum;
	    }
	    var date = new Date();
	    var callback = function(ret, err){
	        if(ret.success == true || ret.success == "true"){
	           var data = eval("("+ret.data+")");
	           var html = "<table style=\"width: 80%;margin: 0 auto;font-size: 20px;\">"
	                    + "<tr style=\"background: #e1e5ee;\"><td>时间</td><td>金额</td></tr>";
	           var total = 0;
	           var j = 0;
	           var m = 1;
	           var money = 0;
	           for(var i=0;i<data.length;i++){
		          total = total + parseFloat(data[i].total);
		          if(kind == "0"){
		            html += "<tr style=\"background: #e1e5ee;\"><td>"+data[i].wmonth+"</td><td>"+data[i].total+"</td></tr>";   
		          }else if(kind == "1"){
		            html += "<tr style=\"background: #e1e5ee;\"><td>"+data[i].rzday+"</td><td>"+data[i].total+"</td></tr>";   
		          }else if(kind == "2"){
		             if(j == 2){
		                 j = 0;
		                 html += "<tr style=\"background: #e1e5ee;\"><td>第"+m+"季度</td><td>"+money+"</td></tr>";
		                 money = 0;
		                 m++;
		              }else{
		                 j++;
		              }
		              money = money + parseFloat(data[i].total);  
		          }
		       }
		       html += "<tr style=\"background: #e1e5ee;\"><td>合计</td><td>"+total+"</td></tr></table>";  
		       $("#data").html(html); 
	        }
	    }
	    var content = {"hotelId":hotelId,"year":date.getFullYear()};
	    apiAjax(JSON.stringify(content),link,callback);
	}
</script>
</html>